{extend name="base" /}
<!-- page specific plugin styles -->
{block name="plugin-styles"}{/block}
<!-- inline styles related to this page -->
{block name="inline-styles"}{/block}
<!-- breadcrumb -->
{block name="breadcrumbs"}
<ul class="breadcrumb">
    <li>
        <i class="ace-icon fa fa-home home-icon"></i>
        <a href="{:url('Index/index')}">首页</a>
    </li>
    <li class="active">商品管理</li>
</ul>
<!-- /.breadcrumb -->
{/block}
<!-- PAGE CONTENT BEGINS -->
{block name="content"}
<div class="page-header">
    <h1>
		商品列表
	</h1>
</div>
<!-- /.page-header -->
<div class="clearfix tableTools-container">
    <form class="pull-left form-inline">
        <div class="form-group">
            <label class="sr-only" for="goodsname">商品名称</label>
            <div class="input-group">
                <span class="input-group-addon">商品名称</span>
                <input type="text" class="form-control input-sm" name="goodsname" placeholder="请输入商品名称">
            </div>
        </div>
        <div class="form-group">
            <label class="control-label" for="catid">商品分类</label>
            <select class="form-control input-sm" name="catid" id="">
                <option value="">全部</option>
                {foreach $cates as $vo}
                <option value="{$vo.id}">{$vo.catname}</option>
                {/foreach}
               
            </select>
        </div>
        <div class="form-group">
            <label class="control-label" for="isshow">上架状态</label>
            <select class="form-control input-sm" name="isshow" id="">
                <option value="0">全部</option>
                <option value="1">已上架</option>
                <option value="2">已下架</option>
            </select>
        </div>
        <div class="form-group">
            <label class="control-label" for="stock">库存</label>
            <select class="form-control input-sm" name="stock" id="">
                <option value="">全部</option>
                <option value="0">库存为0</option>
            </select>
        </div>
        <div class="form-group">
        	<button type="button" class="btn btn-xs btn-primary" id='searchTable'>搜索</button>
        	<button type="reset" class="btn btn-xs btn-primary" id=''>清空</button>
        </div>
    </form>
    <div class="pull-right">
        <a href="{:url('Goods/add')}" class="btn btn-xs btn-primary">新增</a>
    </div>
</div>
<div class="table-responsive">
	<table class="table table-bordered" id="DynamicTable"></table>
</div>
<!-- /.table-responsive -->
{/block}
<!-- PAGE CONTENT ENDS -->
<!-- page specific plugin scripts -->
{block name="plugin-scripts"}
<script src="/static/ace/assets/js/jquery.dataTables.min.js"></script>
<script src="/static/ace/assets/js/jquery.dataTables.bootstrap.min.js"></script>
{/block}
<!-- inline scripts related to this page -->
{block name="related-scripts"}
<script type="text/javascript">
		var myTable = 
		$('#DynamicTable')
		.wrap("<div class='dataTables_borderWrap' />")   //if you are applying horizontal scrolling (sScrollX)
		.DataTable({
			"autoWidth": false,	//智能列宽处理
			"deferRender": true,	//延迟渲染以获得额外的初始化速度
			"info": true,	//表信息显示
			"lengthChange": false,	//更改每页记录数
			"ordering": false,	//排序功能
			"paging": true,	//启用或禁用表分页
			"processing": false,	//处理指标
			// "scrollX": false,	//水平滚动
			// "scrollY": false,	//垂直滚动
			"searching": false,	//搜索功能
			"serverSide": true,	//服务器端处理模式
			"stateSave": false,	//状态保存(页面重新加载时恢复表状态)
			"language": {
                "url": "//cdn.datatables.net/plug-ins/1.10.19/i18n/Chinese.json"
            },
			"ajax": {
                "url": "/admin/goods/rs",
                "type": "POST",
                "data": function (d) {
                    d.goodsname = $("input[name=goodsname]").val();
                    d.catid = $("select[name=catid]").val();
                    d.isshow = $("select[name=isshow]").val();
                    d.stock = $("select[name=stock]").val();
                },
                "dataSrc": function (json) {
                    return json.data;
                }
            },
            "columns": [{
                "title": "商品编号",
                "data": "id"
            }, {
                "title": "商品名称",
                "data": "goodsname"
            }, {
                "title": "是否限时",
                "data": "is_time_limit"
            }, {
                "title": "商品价格",
                "data": "price"
            }, {
                "title": "库存",
                "data": "stock"
            },{
                "title": "销量",
                "data": "sales"
            }, {
                "title": "分类",
                "data": "cateName"
            }, {
                "title": "上架状态",
                "data": "isshow"
            }, {
                "title": "排序",
                "data": "orderby"
            },{
                "title": "操作",
                "data": "id"
            }],
            "columnDefs": [{
            	"className": "text-center",
            	"targets": [0,2,3,4,5,6,7,8]
            },{
                "render": function (data, type, row, meta) {
                    if(data==1){
                        return '<span class="label arrowed arrowed-right label-success">已上架</span>'
                    }else if(data==2){
                        return '<span class="label arrowed arrowed-right label-danger">未上架</span>'
                    }
                },
                "targets": 7   
            },{
                "render": function (data, type, row, meta) {
                	if(data == 1){
                		return '是';
                	}else{
                		return '否';
                	}
                },
                "targets": 2
            }, {
                "render": function (data, type, row, meta) {
                    return '<input type="text" size="8" value='+data+' name="stock" readonly onchange="updateStock(this,'+row.id+')">';
                },
                "targets": 4
            },{
                "render": function (data, type, row, meta) {
                    return '<input type="text" size="8" value='+data+' name="orderby" onchange="updateOrderBy(this,'+row.id+')">';
                },
                "targets": 8
            }, {
            	"render": function (data, type, row, meta) {
            		var add = ''
            		if(row.isshow == 2){
                        add ='<a href="#" class="btn btn-xs btn-danger" data-rel="tooltip" title="上线" onclick="online('+data+')">\
                        <i class="ace-icon fa fa-check-circle bigger-120"></i>\
                        </a>'
                    }else{
                        add = '<a href="#" class="btn btn-xs btn-danger" data-rel="tooltip" title="下线" onclick="offline('+data+')">\
                        <i class="ace-icon fa fa-times bigger-120"></i>\
                        </a>';
                    }
                    return '<div class="btn-group">\
						<a href="{:url('Goods/edit')}?id='+data+'" class="btn btn-xs btn-primary" data-rel="tooltip" title="编辑">\
							<i class="ace-icon fa fa-pencil bigger-120"></i>\
						</a>'
						+add+
						'<a href="#" class="btn btn-xs btn-danger" data-rel="tooltip" title="删除" onclick="del('+data+')">\
							<i class="ace-icon fa fa-trash-o bigger-120"></i>\
						</a>\
					</div>';
                },
                "targets": 9
            }],
            "initComplete": function( settings, json ) {
            	$("#DynamicTable").prev(".row").remove();
            	//add tooltip for small view
				$('[data-rel="tooltip"]').tooltip();
			}
		});
		 $("#searchTable").click(function () {
	            myTable.draw();
	     });
		 

        function del(_id) {
            // body...
            
            var msg = "您真的确定要删除吗？\n\n请确认！"; 
            if (confirm(msg)!=true){ 
             return false; 
            } 
            $.ajax({
                url: '/api/v1/goods/del',
                type: 'POST',
                dataType: 'json',
                data: {id: _id},
            })
            .done(function(json) {
                console.log("success");
                if(json.returnCode==1){
                    alert('操作成功');
                    myTable.draw();
                }else{
                    alert(json.returnMsg);
                }
            })
            .fail(function() {
                console.log("error");
            })
            .always(function() {
                console.log("complete");
            });
            
        }
        
        function online(_id) {
            
            $.ajax({
                url: '/admin/goods/online',
                type: 'POST',
                dataType: 'json',
                data: {id: _id},
            })
            .done(function(json) {
                console.log("success");
                if(json.returnCode==1){
                    alert(json.returnMsg);
                    myTable.draw(false);
                }else{
                    alert(json.returnMsg);
                }
            })
            
        }
        
        function offline(_id) {
            
            $.ajax({
                url: '/admin/goods/offline',
                type: 'POST',
                dataType: 'json',
                data: {id: _id},
            })
            .done(function(json) {
                console.log("success");
                if(json.returnCode==1){
                    alert(json.returnMsg);
                    myTable.draw(false);
                }else{
                    alert(json.returnMsg);
                }
            })
        }
        
        function updateOrderBy(_ele,_id){
        	var value = $(_ele).val()  
        	$.ajax({
                url: '/admin/goods/upload_orderby',
                type: 'POST',
                dataType: 'json',
                data: {id: _id,orderby:value},
            })
            .done(function(json) {
                console.log("success");
                if(json.returnCode==1){
                    alert(json.returnMsg);
                    myTable.draw();
                }else{
                    alert(json.returnMsg);
                }
            })
        }
        
        function updateStock(_ele,_id){
            var value = $(_ele).val()  
            $.ajax({
                url: '/admin/goods/upload_stock',
                type: 'POST',
                dataType: 'json',
                data: {id: _id,stock:value},
            })
            .done(function(json) {
                console.log("success");
                if(json.returnCode==1){
                    alert(json.returnMsg);
                    myTable.draw();
                }else{
                    alert(json.returnMsg);
                }
            })
        }
</script>
{/block}